<template>
	<view class="page">
		<!-- wwl 确认订单 -->
		<!--  @click="onHouse()" -->
		<view class="top_box">
			<view class="left">
				<image src="https://xiaoqu.wuguoxin.vip/uploads/web/map.png" mode="scaleToFill"></image>
			</view>
			<view class="right" @click="onUseraddress()">
				<view class="right_left ">
					<text v-if='address_username'>{{ address_username}} {{ address_mobile}} {{address_dizhi}}</text>
					<text v-else class="active">请设置默认地址</text>
				</view>
				<view class="">
					<n-icon name="right" size="28" color="#959595"></n-icon>
				</view>
			</view>
		</view>
		<view class="info_list" v-if='list && list.length > 0'>
			<view class="info_row" v-for='(row,i) in list' :key='i'>
				<view class="shop">
					<image :src="row.user.avatar" mode="scaleToFill"></image>
					<view class="name">
						{{row.user.name}}
					</view>
				</view>
				<view class="commodity_box" v-for='(c,ci) in row.list' :key='ci'>
					<view class="commodity_row">
						<view class="left">
							<image :src="c.image" mode="scaleToFill"></image>
						</view>
						<view class="right">
							<view class="right_left">
								<view class="name">
									{{c.name}}
								</view>
								<view class="right_right_label">
									选择：
									<block v-if="c.type == 2 || c.type == 11">{{c.goods_sku}}</block>
									<block v-else-if='c.goods_sku && Object.keys(c.goods_sku).length > 0'><text
											v-for='(sku,skui) in  Object.values(c.goods_sku)' :key='skui'>{{Object.keys(c.goods_sku)[skui]}}：{{sku}} {{skui == Object.keys(c.goods_sku).length-1 ? '' :'、'}}</text></block>
								</view>
							</view>
							<view class="right_right">
								<view class="money">
									¥ {{c.amount}}
								</view>
								<view class="num">
									x {{c.count}}
								</view>
							</view>
						</view>
					</view>
					<!-- <view class="">
					</view> -->
					<view class="check_row" v-if='c.have_check == 1'>
						<text>已选择三方监理</text>
						<text class="money">¥{{c.check_amount}}</text>
					</view>
					<view class="other_row3" v-if="c.ratio && integralAll">
						<view class="left">
							<view class="left1">
								装修金抵扣立省{{c.availableIntegra}}元
							</view>
							<view class="left2">
								(当前余额{{integralAll}})
							</view>
						</view>
						<view class="right">
							<view class="money" >
								<text class="" v-if='integralList && integralList.length > 0 && integralList[i][ci].money > 0'>
									-¥{{ integralList[i][ci].money }}
								</text>
								<text class="money2" v-else>
									-¥{{ integralList[i][ci].moneyReference > 0 ? integralList[i][ci].moneyReference : '0.00'}}
								</text>
								</view>
							<view class="" @click="changeIntegral(i,ci)" v-if="Number(integralAll) >= Number(c.availableIntegra)">
								<n-icon name="squarecheckfill"
									v-if='integralList && integralList.length > 0 &&  integralList[i][ci].money > 0' size="32"
									color="#2cc548"></n-icon>
								<n-icon name="squarecheckfill" v-else size="32" color="#b5b5b5"></n-icon>
							</view>
						</view>
					</view>
				</view>
				<view class="other_box">
					<view class="other_row1">
						<view class="left">
							订单备注
						</view>
						<input type="text" class="right" v-model="shopRemark[row.user.id]"  maxlength="20" placeholder="选填,和商家商量一致"
							placeholder-class="text1" />
					</view>

				</view>
				<view class="money_box">
					<text>共{{countShopList[i]}}件</text>
					<view class="">
						<text>小计：</text>
						<text class="money">¥ {{moneyShopList[i].payMoney}}</text>
					</view>
				</view>
			</view>
		</view>
		<view class="pay_box">
			<view class="title">
				选择支付方式
			</view>
			<view class="row" @click="payType = 2">
				<view class="left">
					<image src="https://xiaoqu.wuguoxin.vip/uploads/web/weixin02.png" mode="scaleToFill"></image>
					<text>微信支付</text>
				</view>
				<view class="right" >
					<n-icon name="round_record_fill" v-if='payType == 2' size="36" color="#5677fc"></n-icon>
					<n-icon name="round" size="36" color="#D5D5D5" v-else></n-icon>
				</view>
			</view>
			<!-- <view class="row" @click="payType = 1" v-if="duanType == 1">
				<view class="left">
					<image src="https://xiaoqu.wuguoxin.vip/uploads/web/zhifubao02.png" mode="scaleToFill"></image>
					<text>支付宝</text>
				</view>
				<view class="right">
					<n-icon name="round_record_fill" v-if='payType == 1' size="36" color="#5677fc"></n-icon>
					<n-icon name="round" size="36" color="#D5D5D5" v-else></n-icon>
				</view>
			</view> -->

		</view>
		<view class="button_box" v-if='!loading'>
			<view class="left">
				<text class="text1">共{{countShop}}件</text>
				<text class="text2">实付总计：</text>
				<text class="text3">¥ {{payable}}</text>
			</view>
			<button :loading="saveLoading" class="btn" @click='onSave()'>立即支付</button>
		</view>
	</view>
</template>

<script>
	import {
		getUserInfo
	} from '@/utils/getRequest.js'
	import {
		getConfirmOrderCart,get_address_manage,getConfirmOrderCartYX,setSubmitOrder,setSubmitOrderYX,getIntegralProportion,setOrderCart
	} from "../static/api.js"
	export default {
		data() {
			return {
				address:[],
				address_username: '',
				address_mobile: '',
				address_dizhi: '',
				payType: 2,
				refreshIfNeeded: false,
				list: [],
				saveLoading: false,
				useraddress: 0,
				type: null, // commodity、actuarialSheet ,
				fitment_id : null, //decorationMoneyExchange
				pageInfo: '',
				loading: false,
				// moneyList:[],
				moneyShopList:[],
				countShopList:[],
				integralList: [], // 积分
				integralAll:0,
				integralSurplus:0,
				integralProportion:0,
				totalAmount:'',
				integralMoney:0,
				duanType:1,
				shoplength:0,
				// houseObj:null
				shopRemark:{}
			}
		},
		onShow() {
		    // var pages = getCurrentPages(); // 获取当前页面栈
		    // var currentPage = pages[pages.length - 1]; // 当前页面
		    // if (currentPage.data.refreshIfNeeded) {
		    //     currentPage.data.refreshIfNeeded = false;
		        this.refreshMethod(); // 当前页面 method中的方法，用来刷新当前页面
		    // }
			
			this.getaddress()
		},
		onLoad(params) {
			this.duanType = this.$store.state.duanType
			this.type = params.type
			this.fitment_id = params.fitment_id
			this.shoplength = params.shoplength
			if(this.type  == 'commodity'){
				this.pageInfo = JSON.parse(decodeURIComponent(params.info))
			}else{
				this.pageInfo = {id_arr:params.info}
				
			}
			console.log(this.duanType,'支付type')
			console.log(this.pageInfo,'数据')
			this.getInfo()
			
			
		},
		watch: {
			// choiceHouse(x){
			// 	this.houseObj  = x
			// }
		},
		computed: {
			houseObj(){
				
				return this.$store.state.defaultHouse
			},
			// choiceHouse(){
			// 	return this.$store.state.choiceHouse
			// },
			payable(){
				let c = 0  
				if(this.moneyShopList && this.moneyShopList.length > 0){
					this.moneyShopList.forEach(x=>{
						c = this.$global.formatFloat(c,x.money,1)
					})
				}
				this.totalAmount = c
				this.integralMoney = this.$global.formatFloat(this.$global.formatFloat(this.integralAll,this.integralSurplus ,2),this.integralProportion,3)
				console.log(this.totalAmount,'订单金额1');
				console.log(this.moneyShopList,'订单金额2');
				console.log(this.$global.formatFloat(this.totalAmount,this.integralMoney,2),'订单金额3');
				return this.$global.formatFloat(this.totalAmount,this.integralMoney,2)
			},
			countShop(){
				return this.countShopList && this.countShopList.length > 0 ? this.countShopList.reduce((prev, cur)=> prev + cur) : 0
			}
		},
		methods: {
			//切换档案地址后刷新页面
			refreshMethod(){
				console.log(this.useraddress,'爱上')
				// if(this.useraddress == 1){
				// 	this.useraddress = 0;
				// 	uni.navigateBack()
				// }
			},
			//切换档案地址
			onUseraddress(){
				this.useraddress = 1;
				// uni.navigateTo({
				// 	url:'/pagesMy/housingArchives/index'
				// })
				
				uni.navigateTo({
					url:'/pagesMy/addressmanage/index'
				})
				
			},
			// onHouse(){
			// 	if(this.$store.getters.userInfo){
			// 		uni.navigateTo({
			// 			url:'/pagesMy/housingArchives/index?type=choice'
			// 		})
			// 	}else{
			// 		this.$global.getUserInfo()
			// 	}
			// },
			async onSave(){
				if(!this.houseObj) return uni.showToast({title:'请选择房屋',icon:'none'})
				if(!this.address_dizhi) return uni.showToast({title:'请设置默认收货地址',icon:'none'})
				if(this.payType == 1) return uni.showToast({title:'暂未开通',icon:'none'})
				if(this.saveLoading) return
				this.saveLoading = true
				var fitment_arr = []
				var id_arr = []
				var params = []
				var fitment_arr_length = ''
				this.integralList.forEach(x=>{
					x.forEach(c=>{
						id_arr.push(c.id)
						if(c.money > 0 && c.money == c.moneyReference)  fitment_arr.push(c.id)
						if(c.money > 0 && c.money != c.moneyReference)  fitment_arr_length = c.id
					})
				})
				if(fitment_arr_length) fitment_arr.push(fitment_arr_length)
				
				if(this.type == 'actuarialSheet') {
					params.id_arr = id_arr.join(',')
					
					var pay_typesub = 1;
					var paytypes = 5;
				}
				if(this.type == 'commodity'){
					params = Object.assign(params,this.pageInfo)
					var pay_typesub = 2;
					var paytypes = 4;
				} 
				console.log(params,'支付信息啊啊')
				// var params = {
				// 		fitment_arr:fitment_arr.join(','),
				// 		pay_type:paytypes,
				// 		pay_typesub:pay_typesub,
				// 		house_record_id :this.houseObj.id,
				// 		duan_type:this.duanType,
				// 		shop_remark:JSON.stringify(this.shopRemark)
				// 	}
				params.fitment_arr = fitment_arr.join(',');
				params.pay_type = paytypes;
				params.pay_typesub = pay_typesub;
				params.house_record_id = this.houseObj.id;
				params.duan_type = this.duanType;
				params.shop_remark = JSON.stringify(this.shopRemark);
				params.shoplength = this.shoplength;
				params.address_id = this.address.id;
				//判断平台
				// #ifdef H5 || MP-WEIXIN
				params.pingtai = 1;
				// #endif
				// #ifdef APP-PLUS
				params.pingtai = 2;
				// #endif
				
				if(this.fitment_id) params.fitment_id
				console.log(params,'支付信息啊')
				if(this.pageInfo['marketingCampaign']) params.params = this.pageInfo.type
				try{
					if(this.pageInfo['marketingCampaign']){
						var res = await setSubmitOrderYX(params)
					}else{
						params.debug = 0;
						var res = await setSubmitOrder(params)
						console.log(res,'支付信息')
						
						// return
						if(res['code'] == 1){
							uni.showToast({title:res['msg'],icon:'none'})
							this.$global.$editUploadBack(1,'housingArchives')
							//需要刷新页面
							setTimeout(()=>{
								uni.hideLoading()
								this.loading = false
								uni.navigateBack()
							},2000)
							return
						}
						
					}
					if(params.amount > 100000){
						console.log(res['url'],'支付信息22')
						uni.navigateTo({
							url: `/pagesMy/order/showhfive?url=${encodeURIComponent(JSON.stringify(res['url']))}`
						})
						//APP跳转
						// plus.runtime.openURL(res);
					}else{
						this.onPay(res)
					}
					
				}catch{
					this.saveLoading = false
				}
			},
			onPay(result){
				console.log(result,'result')
				if(this.duanType == 2 ){
					if(this.shoplength >= '1'){
						wx.requestPayment({
								...result,
								"success":function(res){
									console.log(res,'支付成功1')
									uni.showToast({
										title:'支付成功'
									})
									setTimeout(() => {
										uni.reLaunch({url:'/pagesMy/my/index'})
										uni.navigateTo({url:'/pagesMy/order/index'})
									}, 1000);
								},
								"fail":function(res){
									console.log(res,'支付失败1')
									uni.showToast({
										title:'支付失败',icon:'none'
									})
									setTimeout(() => {
										uni.reLaunch({url:'/pagesMy/my/index'})
										uni.navigateTo({url:'/pagesMy/order/index'})
									}, 1000);
								},
								"complete":function(res){
									this.saveLoading = false
								}
							}
						)
					}else{
						uni.requestPayment({
							'provider': 'wxpay',
							 ...result,
							success:  (res1) =>{
							  uni.showToast({
								title:'支付成功'
							  })
							  setTimeout(() => {
								  uni.reLaunch({url:'/pagesMy/my/index'})
							  	 uni.navigateTo({url:'/pagesMy/order/index'})
							  }, 1000);
							},
							complete: () => {
								this.saveLoading = false
							},
							fail: function (err) {
								console.log(err,'支付失败')
							 uni.showToast({
								title:'支付失败',icon:'none'
							 })
							 setTimeout(() => {
								 uni.reLaunch({url:'/pagesMy/my/index'})
							 	 uni.navigateTo({url:'/pagesMy/order/index'})
							 }, 1000);
							}
						});
					}
					
					
					
				}else{
					uni.requestPayment({
						provider:this.payType == 1 ? 'alipay' : 'wxpay',
						orderInfo:result,
						success: e => {
							uni.showToast({title:'支付成功'})
							setTimeout(() => {
								uni.reLaunch({url:'/pagesMy/my/index'})
								 uni.navigateTo({url:'/pagesMy/order/index'})
							}, 1000);
						},
						fail: e => {
							uni.showToast({title:'支付失败',icon:'none'})
							setTimeout(() => {
								 uni.reLaunch({url:'/pagesMy/my/index'})
								 uni.navigateTo({url:'/pagesMy/order/index'})
							}, 1000);
						},
						complete: () => {
							this.saveLoading = false
						}
					});
				}
				
			},
			async changeIntegral(i,ci) {
				var row = Object.assign({},this.integralList[i][ci])
					if(Number(row.money) == 0){
						if(Number(this.integralSurplus) == 0) return uni.showToast({title:'当前积分已使用',icon:'none'})
						
						if( this.integralSurplus - row.availableIntegra > 0 ){ // 够
							 row['money'] = this.$global.formatFloat(row.availableIntegra ,this.integralProportion,3)
							 this.integralSurplus = this.$global.formatFloat(this.integralSurplus , row.availableIntegra,2)
						}else{
							if(Number(row.moneyReference ) > Number(this.integralSurplus)) return uni.showToast({title:'当前积分不足',icon:'none'})
							row['money'] = this.$global.formatFloat(this.integralSurplus,this.integralProportion,3)
							this.integralSurplus = 0
						}
						this.$set(this.integralList[i],[ci],row)
						this.$set(this.moneyShopList[i],'payMoney',this.$global.formatFloat(this.moneyShopList[i].payMoney,row.money,2))
					}else{
						this.integralSurplus = this.$global.formatFloat(this.integralSurplus , row.money/this.integralProportion,1)
						this.$set(this.moneyShopList[i],'payMoney',this.$global.formatFloat(this.moneyShopList[i].payMoney,row.money,1))
						row['money']= '00.0'
						this.$set(this.integralList[i],[ci],row)
						this.integralList.forEach((v,vi)=>{
						  v.forEach(b=>{
							 if(Number(b['money']) != 0 && Number(b['money']) !=  Number(b['moneyReference']) && this.integralSurplus > 0) {
									this.integralSurplus = this.$global.formatFloat(this.integralSurplus ,this.$global.formatFloat(b['money'],this.integralProportion,4),1)
									let oMoney = b['money']
								 if( this.integralSurplus - b['availableIntegra'] > 0 ){
								 	b['money'] = this.$global.formatFloat(b['availableIntegra'] ,this.integralProportion,3)
								 	this.integralSurplus = this.$global.formatFloat(this.integralSurplus , row.availableIntegra,2)
								 }else{
								 	b['money'] = this.$global.formatFloat(this.integralSurplus,this.integralProportion,3)
								 	this.integralSurplus = 0
								 }
								 this.$set(this.moneyShopList[i],'payMoney',this.$global.formatFloat(this.moneyShopList[vi].payMoney,this.$global.formatFloat(b['money'],oMoney,2),2))
							 }
						  })
					})
				}
			},
			async getaddress(){
				uni.showLoading()
				var res = await get_address_manage({status:5});
				console.log(res,'查询地址')
				if(res == null){
					this.address_username = '请设置默认收货地址';
					this.address_mobile = '';
					this.address_dizhi = '';
				}else{
					this.address_username = res.name;
					this.address_mobile = res.phone;
					this.address_dizhi = res.zone_arrs+res.address;
					this.address = res;
				}
				uni.hideLoading()
				
			},
			async getInfo() {
				uni.showLoading()
				this.loading = true
				// if (this.type == 'actuarialSheet') {
					var info  = await getUserInfo()
					this.$store.commit('setUser', info)
					await this.getFitment()
					try {
						if(this.pageInfo['marketingCampaign']){
							var res = await getConfirmOrderCartYX(this.pageInfo)
							console.log(res,'加入购物车1');
							if(res.code == 1){
								console.log(res['code'],'加入购物车4');
								uni.showToast({title:res['msg'],icon:'none'})
							}
						}else{
							var res = await getConfirmOrderCart(this.pageInfo)
							console.log(res,'加入购物车2');
							console.log(res.code,'加入购物车5');
							if(res.code == 1){
								console.log(res['code'],'加入购物车4');
								uni.showToast({title:res['msg'],icon:'none'})
							}
						}
						console.log(res[0]['users_address'],'加入购物车3');
						
						if(res[0]['users_address'] == null){
							this.address_username = '请设置默认收货地址';
							this.address_mobile = '';
							this.address_dizhi = '';
						}else{
							this.address_username = res[0]['users_address'].name;
							this.address_mobile = res[0]['users_address'].phone;
							this.address_dizhi = res[0]['users_address'].zone_arrs+res[0]['users_address'].address;
							this.address = res[0]['users_address'];
						}
						this.list = res
						this.list.forEach(c=>{
							this.shopRemark[c.user.id] = ''
							 let money = 0
							 let count = 0
							 let integral = []
							c.list.forEach(v=>{
								v.availableIntegraC = this.integralProportion && v.ratio ? this.$global.formatFloat(this.$global.formatFloat(v.ratio * 0.01 , v.amount,3), this.integralProportion,4) : 0
								v.configAvailableIntegra = this.integralProportion &&  c.config && c.config.ratio && v.have_check == 1 ? this.$global.formatFloat(this.$global.formatFloat(c.config.ratio * 0.01 , v.check_amount,3), this.integralProportion,4) : 0
								v.availableIntegra = this.$global.formatFloat(v.availableIntegraC,v.configAvailableIntegra,1)
								let rowIntegral = {
									money:0,
									originalMoney: v.have_check == 2  ? v.amount : this.$global.formatFloat(v.amount,v.check_amount,1) ,
									id:v.id,
									availableIntegra:v.availableIntegra,
									moneyReference: Number(v.availableIntegra) <=  Number(this.integralSurplus) ?  this.$global.formatFloat(v.availableIntegra,this.integralProportion,3) :  this.$global.formatFloat(this.integralSurplus,this.integralProportion,3)}
								integral.push(rowIntegral)
								money = v.have_check == 1  ? this.$global.formatFloat(money , rowIntegral.originalMoney,1) : this.$global.formatFloat(money , v.amount,1)
								count = count + Number((v.count ?  v.count : 1))
								
							})
							this.moneyShopList.push({money:money,payMoney:money})
							this.countShopList.push(count)
							this.integralList.push(integral)
							
						})
						// console.log('integralList积分参考表，money：减去金额，originalMoney：原价，availableIntegra：可用装装修金额，moneyReference：可减去的钱',this.integralList)
						// console.log('integralSurplus总装修金',this.integralSurplus)
						// console.log('integralProportion钱：装金',this.integralProportion)
						uni.hideLoading()
						this.loading = false
						this.$forceUpdate()
						
					} catch {
						this.loading = false
						uni.hideLoading()
					}
				// }

			},
			async getFitment(){
				this.integralSurplus = this.integralAll = this.$store.state.userInfo.fitment_amount
				try{
					var res  = await getIntegralProportion()
					this.integralProportion = 1/res
				}catch{}
			}
		},
	}
</script>

<style lang="scss" scoped>
	.page {
		padding: 0rpx 36rpx 200rpx;
		width: 100%;
		box-sizing: border-box;
	}

	.top_box {
		width: 100%;
		background: #ffffff;
		border-radius: 16rpx;
		box-shadow: 0px 6rpx 12rpx 0px rgba(173, 173, 173, 0.37);
		background-color: #fff;
		padding: 58rpx 30rpx;
		box-sizing: border-box;
		display: flex;
		justify-content: space-between;
		align-items: center;

		.left {
			image {
				width: 44rpx;
				height: 44rpx;
			}
		}

		.right {
			width: calc(100% - 60rpx);
			display: flex;
			justify-content: space-between;
			align-items: center;

			.right_left {
				width: calc(100% - 50rpx);
				font-size: 28rpx;
				line-height: 40rpx;
				color: #333;
				.active {
					color: $theme;
					font-size: 700;
				}
			}

			.right_right {
				text-align: right;
			}

			
		}
	}

	.info_row {
		margin-top: 34rpx;
		width: 100%;
		background: #ffffff;
		border-radius: 16rpx;
		box-shadow: 0px 6rpx 12rpx 0px rgba(173, 173, 173, 0.37);
		background-color: #fff;
		padding: 40rpx 22rpx 44rpx 32rpx;
		box-sizing: border-box;

		.shop {
			display: flex;
			justify-content: space-between;
			align-items: center;

			image {
				width: 60rpx;
				height: 60rpx;
				border-radius: 50%;
			}

			.name {
				width: calc(100% - 76rpx);
				font-size: 24rpx;
				line-height: 54rpx;
				color: #000000;
				font-weight: 700;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
			}
		}

		.commodity_box {
			margin-top: 30rpx;
			.commodity_row {
				display: flex;
				justify-content: space-between;
				>.left {
					image {
						width: 144rpx;
						height: 144rpx;
					}
				}

				>.right {
					width: calc(100% - 162rpx);
					display: flex;
					justify-content: space-between;

					.right_right {
						width: 130rpx;
						text-align: right;

						.money {
							font-size: 28rpx;
							line-height: 40rpx;
							color: #272727;
						}

						.num {
							font-size: 28rpx;
							line-height: 40rpx;
							color: #CCCCCC;
						}
					}

					.right_left {
						width: calc(100% - 140rpx);
						height: 144rpx;
						flex-direction: column;
						justify-content: space-between;

						.name {
							font-size: 24rpx;
							line-height: 40rpx;
							color: #272727;
							height: 80rpx;
							overflow: hidden;
							text-overflow: ellispsis;
							display: -webkit-box;
							-webkit-line-clamp: 2;
							-webkit-box-orient: vertical;
						}

						.right_right_label {
							margin-top: 16rpx;
							width: 280rpx;
							height: 48rpx;
							background: #f6f7fb;
							font-size: 20rpx;
							white-space: nowrap;
							overflow: hidden;
							text-overflow: ellipsis;
							color: #ADADAD;
							line-height: 48rpx;
							padding: 0 24rpx;
							box-sizing: border-box;
						}
					}
				}

			}
		}
		.check_row{
			margin-top: 32rpx;
			font-size: 24rpx;
			line-height: 40rpx;
			color: #666666;
			display: flex;
			justify-content: space-between;
			.money{
				color:#b7b7b7
			}
		}
		.other_row3 {
			margin-top: 32rpx;
			display: flex;
			justify-content: space-between;
			.left {
				font-size: 24rpx;
				line-height: 40rpx;
				color: #ff0000;
				width: calc(100% - 170rpx);
				text {
					color: #B7B7B7
				}
			}
			.left1 {
				font-size: 24rpx;
				line-height: 40rpx;
				color: #ff0000;
				width: calc(100% - 170rpx);
				text {
					color: #B7B7B7
				}
			}
			.left2 {
				font-size: 24rpx;
				line-height: 40rpx;
				color: #000000;
				width: calc(100% - 170rpx);
				text {
					color: #B7B7B7
				}
			}
			.right {
				display: inline-block;
				display: flex;
				justify-content: flex-end;
				align-items: center;
				font-size: 24rpx;
				line-height: 40rpx;
				font-size: 22rpx;
				line-height: 40rpx;
				color: #FD0D1B;
				width: 160rpx;
				.money {
					display: inline-block;
					margin-right: 20rpx;
					.money2{
						color:#B7B7B7
					}
				}
			}
		}

	}

	.other_box {
		.other_row1 {
			margin-top: 42rpx;
			display: flex;
			justify-content: space-between;
			align-items: center;
			.left {
				font-size: 24rpx;
				line-height: 40rpx;
				color: #666666;
				width: 5em;
			}

			/deep/.text1 {
				font-size: 24rpx;
				line-height: 40rpx;
				color: #B7B7B7;
			}

			.right {
				width: calc(100% - 5em);
				font-size: 24rpx;
				line-height: 40rpx;
				color: #666666;
			}
		}
	}

	.money_box {
		margin-top: 46rpx;
		color: #464646;
		font-size: 24rpx;
		line-height: 40rpx;
		display: flex;
		justify-content: flex-end;

		text {
			margin-right: 24rpx;
		}

		.money {
			font-size: 22rpx;
			line-height: 40rpx;
			color: #FD0D1B;
		}
	}

	.pay_box {
		margin-top: 32rpx;
		width: 100%;
		background: #ffffff;
		border-radius: 6rpx;
		box-shadow: 0px 6rpx 12rpx 0px rgba(173, 173, 173, 0.37);
		padding: 20rpx 18rpx 20rpx 24rpx;
		box-sizing: border-box;

		.title {
			margin-bottom: 46rpx;
			line-height: 40rpx;
			font-size: 28rpx;
			font-weight: 700;
			color: #101010;
		}

		.row {
			margin-bottom: 40rpx;
			display: flex;
			justify-content: space-between;
			align-items: center;

			.left {
				width: calc(100% - 80rpx);
				color: #101010;
				line-height: 40rpx;
				font-size: 28rpx;
				font-weight: 700;

				image {
					vertical-align: middle;
					width: 35rpx;
					height: 35rpx;
					margin-right: 23rpx;
				}
			}
		}
	}

	.button_box {
		background-color: #fff;
		position: fixed;
		left: 0;
		bottom: 0;
		z-index: 99;
		display: flex;
		justify-content: space-between;
		padding: 28rpx 30rpx 38rpx 20rpx;
		width: 750rpx;
		box-sizing: border-box;

		.left {
			width: calc(100% - 260rpx);
			text-align: right;

			.text1 {
				font-size: 28rpx;
				line-height: 40rpx;
				color: #666666;
				margin-right: 16rpx;
			}

			.text2 {
				font-size: 32rpx;
				line-height: 60rpx;
				color: #2E2D31;
				font-weight: 700;
			}

			.text3 {
				font-size: 32rpx;
				line-height: 46rpx;
				color: #FD0D1B;
				font-weight: 700;
			}
		}

		.btn {
			width: 240rpx;
			height: 64rpx;
			line-height: 64rpx;
			color: #fff;
			background: $theme;
			border-radius: 32rpx;
			font-size: 32rpx;

		}
	}

	button[loading]::before {
		align-self: center
	}

	button {
		display: flex;
		justify-content: center;
		align-item: center;
		padding: 0;
	}

	button::after {
		border: none;
	}
</style>
